export class Toast {
  constructor() {
    // 创建弹框 DOM
    this.wrapper = document.createElement("div");
    this.content = document.createElement("div");

    // 设置 wrapper 样式
    this.wrapper.style.position = "fixed";
    this.wrapper.style.left = "0";
    this.wrapper.style.top = "0";
    this.wrapper.style.width = "100%";
    this.wrapper.style.height = "100%";
    this.wrapper.style.backgroundColor = "rgba(0, 0, 0, 0.7)";
    this.wrapper.style.zIndex = "9999";
    this.wrapper.style.display = "none";
    this.wrapper.style.color = "black";

    // 设置 content 样式
    this.content.style.position = "absolute";
    this.content.style.left = "50%";
    this.content.style.top = "50%";
    this.content.style.transform = "translate(-50%, -50%)";
    this.content.style.padding = "10px 20px";
    this.content.style.borderRadius = "10px";
    this.content.style.backgroundColor = "#fff";
    this.content.style.minWidth = "150px";
    this.content.style.textAlign = "center";
    this.content.style.fontSize = "14px";
    this.content.style.boxShadow = "0 2px 8px rgba(0,0,0,0.3)";

    this.wrapper.appendChild(this.content);
    document.body.appendChild(this.wrapper);

    // 默认隐藏
    this.wrapper.style.display = "none";
  }

  /**
   * 显示弹框
   * @param {string} message - 显示内容
   * @param {number} duration - 显示时间，毫秒
   */
  show(message, duration = 1500) {
    this.content.innerHTML = message;
    this.wrapper.style.display = "block";

    if (this._timeout) clearTimeout(this._timeout);

    this._timeout = setTimeout(() => {
      this.wrapper.style.display = "none";
    }, duration);
  }
}
const myToast = new Toast();
export { myToast };
